<template>
    <div>
        <div style="background: #141414;height: 100px;padding: 12px">
            <input-tag :disabled="disabled" theme="dark" clearable @search="search" v-model="array">
                <div slot="empty">
                    为空
                </div>
            </input-tag>
        </div>

        <div style="height: 100px;padding: 12px">
            <input-tag is-search :disabled="disabled" clearable @search="search" v-model="array">
                <div slot="empty">
                    为空
                </div>
            </input-tag>
        </div>
        <button @click="disabled=!disabled"></button>
    </div>

</template>

<script>
    import InputTag from './components/index'

    export default {
        name: 'App',
        components: {
            InputTag
        },
        data() {
            return {
                array: [
                    {label: 'label', value: 'value'}
                ],
                visible:false,
                disabled:false
            }
        },
        methods: {
            search(value, callback) {
                callback([{
                    label: '1',
                    value: '2'
                },{
                    label: '3',
                    value: '4'
                }])
            },
            onchange(){
                this.visible = !this.visible
            }
        }
    }
</script>

<style>
    #app {
        font-family: Avenir, Helvetica, Arial, sans-serif;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        color: #2c3e50;
        margin-top: 60px;
    }
</style>
